{include file="common/header"}
<div id="app" v-cloak>
    <el-container class="el-layout">
        <el-aside width="192px">
            <el-tabs v-model="tab" :tab-position="document.body.clientWidth > 768 ? 'left' : 'top'" stretch>
    			<el-tab-pane v-for="(item, index) in tabs" :key="index" :label="item.label" :name="String(index)"></el-tab-pane>
            </el-tabs>
        </el-aside>
        <el-container>
            <div class="el-content">
                <iframe :src="admin_url(tabs[tab]['path'])"></iframe>
            </div>
        </el-container>
    </el-container>
</div>
<script>
	new Vue({
	    el: '#app',
	    data() {
	        return {
	            tabs: {:json_encode($config)},
	            tab: '',
	        }
	    },
	    created() {
	        this.tab = window.location.hash === "" ? '0' : window.location.hash.replace('#', '');
	    },
	    watch: {
	        tab(name) {
	            // 锚点
    		    let path = parent.parentVm.path.split('#');
    		    parent.parentVm.path = path[0] + '#' + name;
	        }
	    }
	})
</script>
{include file="common/footer"}